<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8" />
 <title>canvas</title>
 <style type="text/css">
   #c1{
    border:1px solid red;
   }
 </style>
<body>
 <canvas id="c1" width="1340" height="1000"></canvas>
 <script type="text/javascript">
  window.onload=function(){
   var c1=document.getElementById("c1"); //获取元素
   var ctx=c1.getContext('2d'); //设置绘制环境
   ctx.translate(300,150); //相对于画布的偏移位置
   setInterval(function(){
    ctx.clearRect(0,0,c1.width,c1.height);
    ctx.rotate(Math.PI/180);
    ctx.fillRect(0,0,100,100);
    ctx.stroke();

   },30);
  }
 </script>